import React from 'react'
import PureRenderMixin from 'react-addons-pure-render-mixin'
import { getOrderListData,postComment} from '../../../fetch/user/orderlist'

import OrderListComponent from '../../../components/OrderList'

import './style.less'

class OrderList extends React.Component {
    constructor(props, context) {
        super(props, context);
        this.shouldComponentUpdate = PureRenderMixin.shouldComponentUpdate.bind(this);
        this.state = {
            data: []
        }
        this.submitComment = this.submitComment.bind(this)
    }
    render() {
        let {username} = this.props;
        //console.log(this.state.data)
        return (
            <div className="order-list-container">
                <h2>您的订单{username}</h2>
                {
                   this.state.data.length ? 
                   <OrderListComponent
                        {...{
                            data:this.state.data,
                            submitComment:this.submitComment
                        }}
                   />
                   :<h2>您占时还没有任何订单信息</h2>
                }
            </div>
        )
    }
    componentDidMount() {
        //获取订单信息
        let {username} = this.props;
        if(username) {
            //处理数据
            this.loadOrderList(username)
        }
    }
    //处理数据
    loadOrderList(username){
        let result = getOrderListData(username);//返回promise对象
        result.then(res=>{
            return res.json()
        }).then(json=>{
            //console.log(json)
            this.setState({
                data:json 
            });
        })
    }
    //提交评论
    submitComment(id,value,callback){
        //console.log('提交的评论')
        //将数据提交到后台
        const result = postComment(id,value)
        result.then(res=>{
            return res.json()
        }).then(json=>{
            if(json.errno ===0){
                //后台返回正常提交了
                alert('评论提交成功')
                callback()
            }
        })
    }


}

export default OrderList